
@import url(./index.less);
@import url(../../../styles/common.less);
@keyframes title_animation {
    0%{
        transform: scale(3);
        opacity:0;
    }
    100%{
        transform: scale(1);
        opacity:1;
    }
}
.job_section{
    .job_part();
    .flex(@fd: column;);
   
    background: var(--accentColor2);
   .title{
    .title();
    transform: scale(1);
   }
   .title_open{
        animation-name: title_animation;
        animation-duration: .5s;
        animation-delay: 0.8s;
        animation-timing-function: ease-in;
        opacity: 1;
        transform: scale(1);
    }
   .contacts{
    padding: 2rem;
    .contact_item{
        color: var(--textTitleColor);
        margin-bottom: 1rem;
        .label{
            font-size: 1.2rem;
        }
        .value{
            font-size: 1.2rem;
            :global{
                .clipboard__container__text{
                    text-decoration: underline;
                }
            }
        }
        .wechat_code{
            width: 3rem;
            height: 3rem;
        }
       }
   }
 
   .down_btn{
    font-size: 1.2rem;
    color: var(--textTitleColor);
   }
}


@media screen and (max-width: @mobile_screen) {
    .job_section{
        .flex(@fd: column);
        .job_part_mobile();
        .title{
            .title_mobile();
        }
        .title_open{
            animation-duration: 1s;
        }

           .contacts{
            padding: 1.5rem;
            .contact_item{
                padding-bottom: .6rem;
                color: var(--textTitleColor);
                margin-bottom: 0rem;
                .label{
                    font-size: 1.2rem;
                }
                .value{
                    font-size: 1.2rem;
                }
                .wechat_code{
                    width: 3rem;
                    height: 3rem;
                }
               }
           }
        .down_btn{
            color: var(--textTitleColor);
            font-size: 1.2rem;
        }
       
    }
}